import React, { Component } from 'react'

export default class App extends Component {
  state = { isLiked: true }
  render() {
    // 不要在jsx代码中写if else
    // jsx代码中可以写 表达式   三元运算符 与 或 非
    // return (
    //   <div>
    //     {
    //       if (this.state.isLiked) {
            
    //       }
    //     }
    //   </div>
    // )

    // 先写if else，在其内部返回jsx代码
    // 代码的冗余度太高
    // if (this.state.isLiked) {
    //   return (
    //     <div><h1>条件判断</h1>喜欢</div>
    //   )
    // } else {
    //   return (
    //     <div><h1>条件判断</h1>不喜欢</div>
    //   )
    // }

    // 可以把条件提取出来 --- 但是定义了变量
    // let com = null
    // if (this.state.isLiked) {
    //   com = <div>喜欢</div>
    // } else {
    //   com = <div>不喜欢</div>
    // }
    // return (
    //   <div>
    //     <h1>条件判断</h1>
    //     {
    //       com
    //     }
    //   </div>
    // )

    // 使用三元运算符
    return (
      <div>
        <h1>条件判断</h1>
        {
          this.state.isLiked ? <div>喜欢</div> : <div>不喜欢</div>
        }
      </div>
    )
  }
}
